<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>火锅后台管理系统</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <script type="text/javascript" src="../js/jquery-2.1.4.js"></script>
  <script src="../js/vue.js"></script>
  <link rel="stylesheet" href="../layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="../layuiadmin/style/admin.css" media="all">
  <link rel="shortcut icon" href="#"/>

</head>
<body class="layui-layout-body">
  
  <div id="LAY_app">
    <div class="layui-layout layui-layout-admin">
      <div class="layui-header">
        <!-- 头部区域 -->
        <ul class="layui-nav layui-layout-left">
          <li class="layui-nav-item layadmin-flexible" lay-unselect>
            <a href="javascript:;" layadmin-event="flexible" title="侧边伸缩">
              <i class="layui-icon layui-icon-shrink-right" id="LAY_app_flexible"></i>
            </a>
          </li>
          <li class="layui-nav-item" lay-unselect>
            <a href="javascript:;" layadmin-event="refresh" title="刷新">
              <i class="layui-icon layui-icon-refresh-3"></i>
            </a>
          </li>
        </ul>
        <ul class="layui-nav layui-layout-right" lay-filter="layadmin-layout-right">

          <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="javascript:;" layadmin-event="theme">
              <i class="layui-icon layui-icon-theme"></i>
            </a>
          </li>
          <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="javascript:;" layadmin-event="note">
              <i class="layui-icon layui-icon-note"></i>
            </a>
          </li>
          <li class="layui-nav-item layui-hide-xs" lay-unselect>
            <a href="javascript:;" layadmin-event="fullscreen">
              <i class="layui-icon layui-icon-screen-full"></i>
            </a>
          </li>
          <li class="layui-nav-item" lay-unselect style="margin-right: 20px">
            <a href="javascript:;">
              <cite>{{username}}</cite>
            </a>
            <dl class="layui-nav-child">
              <dd><a href="javascript:;" id="changePwd">修改密码</a></dd>
              <hr>
              <dd style="text-align: center;"><a href="/houtai/logout">退出</a></dd>
            </dl>
          </li>
          
        </ul>
      </div>
      
      <!-- 侧边菜单 -->
      <div class="layui-side layui-side-menu">
        <div class="layui-side-scroll">
          <div class="layui-logo" lay-href="home/console.html">
            <span>后台管理系统</span>
          </div>
          
          <ul class="layui-nav layui-nav-tree" lay-shrink="all" id="LAY-system-side-menu" lay-filter="layadmin-system-side-menu">
            <li data-name="home" class="layui-nav-item">
              <a lay-href="/houtai/page/countIndex/countIndex.html" lay-tips="组件" lay-direction="2">
                <i class="layui-icon layui-icon-home"></i>
                <cite>首页</cite>
              </a>
            </li>
            <li data-name="home" class="layui-nav-item" v-for="level1 in menuTree">
              <a href="javascript:;" lay-tips="组件" lay-direction="2">
                <i class="layui-icon layui-icon-auz"></i>
                <cite>{{level1.menuDesc}}</cite>
              </a>
              <dl class="layui-nav-child">
                <dd data-name="console" v-for="level2 in level1.childrens">
                  <a :lay-href="level2.menuUrl" target="frame">{{level2.menuDesc}}</a>
                </dd>
              </dl>
            </li>
          </ul>
        </div>
      </div>

      <!-- 页面标签 -->
      <div class="layadmin-pagetabs" id="LAY_app_tabs">
        <div class="layui-icon layadmin-tabs-control layui-icon-prev" layadmin-event="leftPage"></div>
        <div class="layui-icon layadmin-tabs-control layui-icon-next" layadmin-event="rightPage"></div>
        <div class="layui-icon layadmin-tabs-control layui-icon-down">
          <ul class="layui-nav layadmin-tabs-select" lay-filter="layadmin-pagetabs-nav">
            <li class="layui-nav-item" lay-unselect>
              <a href="javascript:;"></a>
              <dl class="layui-nav-child layui-anim-fadein">
                <dd layadmin-event="closeThisTabs"><a href="javascript:;">关闭当前标签页</a></dd>
                <dd layadmin-event="closeOtherTabs"><a href="javascript:;">关闭其它标签页</a></dd>
                <dd layadmin-event="closeAllTabs"><a href="javascript:;">关闭全部标签页</a></dd>
              </dl>
            </li>
          </ul>
        </div>
        </ul>
        <div class="layui-tab" lay-unauto lay-allowClose="true" lay-filter="layadmin-layout-tabs">
          <ul class="layui-tab-title" id="LAY_app_tabsheader">
            <li lay-id="home/console.html" lay-attr="home/console.html" class="layui-this"><i class="layui-icon layui-icon-home"></i></li>
          </ul>
        </div>
      </div>
      
      
      <!-- 主体内容 -->
      <div class="layui-body" id="LAY_app_body">
        <div class="layadmin-tabsbody-item layui-show">
          <iframe src="/houtai/page/countIndex/countIndex.html" name="frame" frameborder="0" class="layadmin-iframe"></iframe>
        </div>
      </div>
      
      <!-- 辅助元素，一般用于移动设备下遮罩 -->
      <div class="layadmin-body-shade" layadmin-event="shade"></div>
    </div>
  </div>
  <div class="layui-row" id="popInsertUser" style="display:none;">
    <form class="layui-form layui-form-pane" id="insertForm" lay-filter="insertFilter">
      <div class="layui-form-item" style="margin-top: 10px;margin-left: 30px;width: 350px">
        <label class="layui-form-label">原密码</label>
        <div class="layui-input-block">
          <input name="oldPwd" id="oldPwd" type="password" lay-verify="notNull" autocomplete="off" placeholder="请输入原密码" class="layui-input">
          <span id="oldPwdMessage" style="color: red"></span>
        </div>
      </div>

      <div class="layui-form-item" style="margin-top: 10px;margin-left: 30px;width: 350px">
        <label class="layui-form-label">新密码</label>
        <div class="layui-input-block">
          <input name="newPwd1" type="password" id="password" lay-verify="pass" autocomplete="off" placeholder="新密码，6-20为数字字母组合" class="layui-input">
        </div>
      </div>
      <div class="layui-form-item" style="margin-top: 10px;margin-left: 30px;width: 350px">
        <label class="layui-form-label">新密码</label>
        <div class="layui-input-block">
          <input name="newPwd2" id="repass" type="password" lay-verify="pass" autocomplete="off" placeholder="确认新密码，6-20为数字字母组合" class="layui-input">
          <span id="pwdNotSame" style="color: red"></span>
        </div>
      </div>

      <div class="layui-form-item" style="margin-top: 20px">
        <div class="layui-input-block">
          <input type="button" class="layui-btn" lay-submit id="changePwdSubmit" value="立即提交">
        </div>
      </div>
    </form>
    <!--地区显示区域-->
    <div id="insertContainer" style="width: 100%;height: 220px"></div>
  </div>
  <script src="../layuiadmin/layui/layui.js"></script>

  <script>
    layui.config({
      base: '../layuiadmin/' //静态资源所在路径
    }).extend({
      index: 'lib/index' //主入口模块
    }).use('index');
   var vue = new Vue({
        el:"#LAY_app",
        data:{
            menuTree:[],
            buttons:[],
            list:[],
            username:""
        },
        created:function(){
            this.selectMenuTree();
        },
        methods:{
            selectMenuTree:function () {
                var _this = this;
                $.ajax({
                    url:"/houtai/adminuser/user/selectMenuTree",
                    dataType:"json",
                    async: false,
                    type:"get",
                    success:function (data) {
                        console.log(data);
                        if(data.code == "200"){
                            _this.menuTree = data.li;
                            _this.username = data.message;
                            console.log(data);
                        }else {
                            alert(data.message);
                        }

                    }
                })
            }
        }
    });

    layui.use(['table','jquery','laypage','util','laydate','form','layer'], function() {
      var table = layui.table;
      var $ = layui.jquery;
      var util = layui.util;
      var laydate = layui.laydate;
      var form = layui.form;
      var layer = layui.layer;

      //验证表单内容
      form.verify({
        notNull:function (value, item) {
          if(value == null || value.trim() == ''){
            return "内容不能为空";
          }
        },
        pass:[
          /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/,
          '密码是6-20为数字字母组合'
        ]
      });

      $("#changePwd").click(function () {
        layer.open({
          //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
          type: 1,
          title: "修改密码",
          area: ['400px', '300px'],//设置弹出层尺寸
          content: $("#popInsertUser")//引用的弹出层的页面层的方式加载修改界面表单
        });
      });

      $("#changePwdSubmit").click(function () {
        var pwd = $("#password").val();
        var repwd = $("#repass").val();
        if(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/.test(pwd) && pwd == repwd){
          $("#pwdNotSame").text("");
          $.ajax({
            url:"/houtai/adminuser/changePwd",
            data:{pwd:repwd},
            type:"post",
            dataType:"json",
            success:function (data) {
              if(data.message == "success"){
                layer.msg("修改成功");
                //关闭弹出层
                layer.closeAll();

                $.ajax({
                  url:"/houtai/logout",
                  type:"post",
                  success:function (data) {
                      location.href = "/houtai/page/adminuser/login.html";
                  }
                })

              }else{
                layer.msg("修改失败");
              }
            }
          })
        }else if(pwd != repwd){
          $("#pwdNotSame").text("原密码和新密码不一致");
        }
      });

      //校验原密码是否正确
      $("#oldPwd").blur(function () {
        console.log("校验原密码");
        var oldPwd = $("#oldPwd").val();
        if(oldPwd != null && oldPwd.trim() != ""){
          $.ajax({
            url:"/houtai/adminuser/checkOldPwd",
            data:{pwd:oldPwd},
            type:"post",
            dataType:"json",
            success:function (data) {
              console.log(data);
              if(data.message == "success"){
                console.log("原密码正确");
                $("#oldPwdMessage").text("");
                $("#changePwdSubmit").attr("disabled",false);
              }else{
                console.log("原密码错误");
                $("#oldPwdMessage").text("原密码错误");
                $("#changePwdSubmit").attr("disabled",true);
              }
            }
          })
        }
      });


    })
  </script>
</body>
</html>


